/* 
    Document   : layout
    Created on : 17 avr. 2013, 18:17:36
    Author     : User
    Description:
        Purpose of the stylesheet follows.
*/


root { 
    display: block;
    
}

table{
   padding: 0px; 
   border-collapse: collapse;
   
    
}
td{
   padding: 0px;
   border-spacing:0;
    
}

tr{
    padding: 0px;
   border-spacing:0;
    
}

textarea{ resize:none; height:auto;}

body { 
    width:100%;
    margin: 0;
    
    font-family: verdana,arial,monospace;
    font-size: 12px;
    
    background: url(../img/motif_bandeau-gauche_bleu.png) repeat-y left;
    background-color: #848484;
}

#general_content { 
    width: 894px;
    height:100%;
    margin-top:50px;
    margin-left: 250px;
    /*background-color: black;*/
}
/*
#erreur{
    
    width:100%;
    padding:20px;
    padding-left:250px;
    
    color:white;
    
    min-height:100%;
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x bottom;
    background-color: #F9302F;
    border: solid 1px red ;
}*/

#page_content,#bar_post{ 
    max-width: 840px;
    margin-left: 27px;
    /*padding:12px;*/
    padding-top:20px;
    padding-bottom:20px;
    
    min-height:100%;
    background-color: white;
    
}
/*#page_content{ 

    min-height:200%;

}*/

#bar_post{
   
    padding-top:11px;
    padding-bottom:10px;
    
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x top;
    background-color: #FA592F;
    
    border-bottom: solid 5px #F9322F;
    
    text-align : center;
    
}

#top_panel,#erreur,#chat{
    
    width: 100%;
    
    padding-top:10px;
    padding-bottom:10px;
    padding-left:250px;
    
    position: fixed;
    text-align:left;
    
    z-index: 200;
    
    /*box-shadow: 0px 0px 13px grey;*/ 
    
}
#top_panel{
  top: 0px;
  height:30px;
  
    color:white;
    background: url(../img/motif_header2.png) repeat-x bottom;
    background-color: #323232;
    border-bottom: solid 2px #FA7C2F ;
    
    /*left:0;*/
}

#erreur{
  /*position:inherit;*/
  bottom: 0px;
  
    color:white;
    background: url(../img/motif_fond_bouton_orange.png) repeat-x bottom;
    background-color: #F9922F;
    border-top: solid 1px red ;
    
    /*left:0;*/
}


#chat{
  /*position:inherit;*/
  height:30px;
  bottom: 0px;
  padding-top:0px;
  padding-left:30px;
    color:black;
    background: url(../img/motif_header2.png) repeat-x bottom;
    background-color: #323232;
    border-top: solid 2px #FA7C2F ;
    
    /*left:0;*/
}

#chat_list{
    overflow:auto;
/*    overflow-style: scrollbar move;*/
    /*height:150px;*/
    width: 160px;
    background-color: #323232;
    position:fixed;
    margin-left:30px;
    /*bottom:10px;*/
    vertical-align: top;
    padding:10px;
    
    z-index: 150;
    
}


#left_panel{
    
    width: 180px;
    /*height:100%;*/
    margin-left:30px;
    margin-top: -30px;
    position:fixed;
    
    /*background-color: #006471;*/
    text-align:left;
    
    z-index: 300;
    
    border-bottom:solid 10px #757575;
}
/*
#chat{
    
    width: 151px;
    height:300px;
    margin-left:30px;
    bottom:10px;
    position:fixed;
    
    background-color: #006471;
    text-align:left;
    
    z-index: 101;
}*/


.content.header, #footer_panel_left,.bar_comment{
    
    color:white;
    margin: 0px;
    
    padding:10px;
    background: url(../img/motif_header_panel_left.png) repeat-x top;
    
    background-color:  #646464;
}

.bar_comment{
    text-align:right;
    border-top:solid 4px #494949;
}

span.icone_photo{
    
    background-color: white;
    /*display:inline-block;*/
    /*vertical-align: middle;*/
    margin-right:5px;
    width:35px;
    height:35px;
    float:left;
    
}

/*span.icone_photo{
    position : absolute;
    z-index:0;
    margin-left:-45px;
    
    
}*/

#footer_panel_left,.bar_comment{
     background: url(../img/motif_footer_panel_left.png) repeat-x top;
     background-color: #404040;
}

#footer_panel_left{
     border-top:solid 2px #F9302F;
}


/*#left_panel table.bts{
    width: 100%;
    
    border:solid 2px #006471;
    border:solid 2px #494949;
    border-bottom:0px;
    border-spacing: 2px;
}*/

#left_panel tr{
    margin: 0px;
    padding: 0px;
    
    /*background: url(../img/motif_option_panel_left.png) repeat-x top;*/
    /*background: url(../img/motif_option_panel_left_hover.png) repeat-x top;*/
    /*background-color: #00a3b5;*/
    
    
}

/*#left_panel tr.bt_menu:hover{
    background: url(../img/motif_option_panel_left.png) repeat-x top;
    background-color: #00a3b5;
    
}*/

#chat_list,#header_chat_list,.onglet_chat,.chat_window,.user_view,.contact_view,.comment,.commentPoster,.commentButtons{
    /*min-height: 100%;*/
    /*margin: 0px;*/
    padding: 5px;
    
    /*text-align:center;*/
    /*background: url(../img/motif_option_panel_left_hover.png) repeat-x top;*/
    /*border-bottom:solid 2px #494949;*/
    /*background-color: #494949;*/
}

#chat_list{
    width:170px;
    background-color: #494949;
    
    
}

#header_chat_list,.onglet_chat{
    display : inline-block;
    
    width:170px;
    border-top:solid 2px #F9302F;
    background: url(../img/motif_header.png) repeat-x bottom;
    background-color: #FAFAFA;
    float:left;
    text-align: center;
    margin-right:10px;
    
    -webkit-border-radius: 0px 0px 5px 5px;
    -moz-border-radius: 0px 0px 5px 5px;
    border-radius: 0px 0px 5px 5px;
    
}

.onglet_chat{
    width:200px;
    text-align:right;
}

.chat_window{
    width:200px;
    max-width:200px;
/*    height:300px;
    max-height:300px;*/
    background: url(../img/motif_header.png) repeat-x bottom;
    background-color: #FAFAFA;
    
    border:solid 1px #494949;
    
    position : fixed;
    
    bottom:30px;
    left:219px;
    
    z-index:160;
    
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    border-radius: 5px 5px 0px 0px;
    
}



.chat_input textarea{
    width:186px;
    height:70px;
    
}

.chat_view{
    
   /*vertical-align: top;*/ 
    max-height:200px;
    overflow:auto;
    margin-bottom:3px;
}

.user_view,.contact_view{
/*    padding-top:0px;
    height:100px;
    background-color: black;*/
    
   
    /*position:relative;*/
    
     /*min-height: 40px;*/
    padding:2px;
    text-align: center;
    /*max-width:199px;*/
    
}
.user_view{
/*    padding-top:0px;
    height:100px;
    background-color: black;*/
    
    background: url(../img/motif_fond_bouton_bleu.png) repeat-x bottom;
    background-color: #00F6FF;
   
}
.contact_view{
/*    padding-top:0px;
    height:100px;
    background-color: black;*/
    
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x bottom;
    background-color: #F9312F;
/*    min-height: 40px;
    padding:2px;*/
}



.chat_input{
    /*padding-top:0px;*/
    height:100px;
    /*background-color: black;*/
    
}

#chat_list .bt{

    border-right:solid 7px #24F200;
    
}

.commentPoster{
    background-color:#D8D8D8;
}
.commentButtons{
    width:70px;
    background-color:#BCBCBC;
}

.commentPoster,.commentButtons{
   border-top:solid 3px #BCBCBC;
   /*border-top-style:dotted;*/
}

.commentContent,.chat_text{
    display:inline-block;
    
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    
    background-color: white;
    color:black;
    
    width:510px;
    max-width:510px;
    padding:5px;
    
    border-left:solid 1px #DFDFDF;
    border-top:solid 1px #DFDFDF;
    
    border-right:solid 4px #DFDFDF;
    border-bottom:solid 4px #AFAFAF;
    
}

.chat_text{
    /*display:block;*/
    padding:5px;
    width:160px;
    text-align: left;
}



.comment{
    background-color: transparent;
    /*border-top:solid 1px #BCBCBC;*/
}

#left_panel #menu_left{
    padding:0;
    width:29px;
   
    background: url(../img/motif_fond_user-header_gauche.png) no-repeat top;
   
}
#left_panel #menu_center{
    padding:0;
    width:auto;
     height:58px;
    background: url(../img/motif_fond_user-header_fleche.png) no-repeat top;
/*    vertical-align: top;*/
    background-color:#F9302F;
    
}
#left_panel #menu_right{
    padding:0;
    width:29px;

    background: url(../img/motif_fond_user-header_droite_reverse.png) no-repeat top;
    
}

td.content{
    background-color: white;
    min-width:60px;
}

#page_content td.content{
    background-color: white;
    padding:10px;
}

#page_content td.content.header{
    background: url(../img/motif_header_panel_left_demi.png) repeat-x top;
    
    background-color: white;
    /*height:1px;*/
    /*background-color:#F9322F;*/
}



table.posts{
    width:590px;
    max-width:590px;
    margin:auto;
    
    background-color: #EFEFEF;
    border:solid 7px #EFEFEF;
     box-shadow: 0px 0px 1px #848484,0px 0px 1px #848484,0px 0px 1px #848484;
     
     margin-bottom: 40px;
    
    /*display:inline-block;*/
    
/*    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;*/
    
    /*color:red;*/
    
/*    background-color: black;
    border-left:solid 1px #B0B0B0;
    border-right:solid 1px #B0B0B0;
    border:solid 1px #B0B0B0;*/
}


#page_content .separator_post_comment{
    padding:5px;
    width:auto;
     height:19px;
    background: url(../img/motif_fond_user-header_fleche.png) repeat-x center bottom;
/*    vertical-align: top;*/
    background-color:#AFAFAF;
    border-bottom:solid 4px #AFAFAF;
    text-align:right;
}

#left_panel span.donnee{
    
    /*z-index:150;*/
    
/*    display:block;*/
    position:absolute;
    
    right:40px;
    margin-top:-1px;
   
    
    color:white;
    font-size: 11px;

    background-color: red;
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x bottom;
    
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    
/*    padding-left: 6px;
    padding-right: 6px;*/
    padding-top:0px;
    padding-bottom:0px;
    padding-left:3px;
    padding-right:3px;
    
    border-top: solid 2px red;
    border-bottom: solid 1px #DaDaDa;
    
/*    text-shadow:
black 1px 1px,
#FA4B2F -1px 1px,
#FA4B2F -1px -1px,
black 1px -1px; */
    
    /*border: solid 1px white;*/
    
    /*border-bottom: solid 2px #DaDaDa;*/

}

#left_panel span.donnee.top{
    
/*    display:block;
    position:absolute;*/
    
/*    margin-left:138px;
    
    margin-top:-1px;*/
   
    
    /*border: solid 2px #F9302F;*/
    
    /*box-shadow: 2px 1px 0px #494949;*/ 
    
    
   
}
    
#left_panel span.donnee.bleu{
    
    
    /*display:block;*/
    /*position:absolute;*/
    
    /*margin-left:138px;*/
/*    right:13px;
    margin-top:0px;*/
    
    /*height:13px;*/
    
/*    display:block;
    position:relative;*/
    
    /*margin-left:100%;*/
    /*margin-top:2px;*/
    
    
    background: none;
    background-color: #008aff;
    
    border-top: solid 2px blue;
    border-bottom: solid 1px #DaDaDa;
}

span.surlign{
    
    background-color: white; 
    color:black;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    
    padding-left: 7px;
    padding-right: 7px;
    padding-top:4px;
    padding-bottom:4px;
    
    display:inline-block;

}

span.surlign.grey{

    background-color: #e3e3e3; 
    
}

.bt_up{
    
   visibility:hidden;
   position:fixed;
   left:150px;
   bottom:50px;
   cursor: pointer;

}




input,textarea{
    
    border:none;

    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    
    padding-left: 7px;
    padding-right: 7px;
    padding-top:4px;
    padding-bottom:4px;
    
    box-shadow: 0px 0px 2px black inset,0px 0px 3px #B4B4B4 inset;

    
    color:grey;
}



.text_area{
    width:250px;
    height:20px;
   
    background-color:#EFEFEF;
    
    border-left:solid 4px #DFDFDF;
    border-top:solid 4px #AFAFAF;
    /*border-right:solid 1px #DFDFDF;*/
    /*border-bottom:solid 1px #DFDFDF;*/
    
    /*background: url(../img/motif_fond_user-header.png) repeat-x center;*/
    /*background: url(../img/motif_header_panel_left.png) repeat-x top;*/
}

.text_area:focus{
    /*border:solid 1px #FF5A00;*/
/*    background: #d2d2d2;
    color:black;*/

    box-shadow: 0px 0px 2px black inset,0px 0px 3px #B4B4B4 inset,0px 0px 6px grey,0px 0px 7px grey;

}

.text_area#type_post:focus{
    /*border:solid 1px #FF5A00;*/
/*    background: #d2d2d2;
    color:black;*/

    box-shadow: 0px 0px 2px black inset,0px 0px 3px #B4B4B4 inset,0px 0px 6px orange,0px 0px 7px orange;

}

input.large,textarea.large{
    
    width: 776px;
    max-width: 776px;
}

input.demi,textarea.demi{
    
    width: 530px;
    max-width: 530px;
}

#top_panel input{
    border-left:solid 1px #323232;
    border-top:solid 1px #323232;
    border-right:solid 1px #323232;
    border-bottom:solid 1px #737373;
    
    box-shadow: 0px 0px 1px black inset,0px 0px 3px black inset;
    
}

#top_panel input.text_area{

    background: url(../img/motif_header_panel_left.png) repeat-x top;
}

#top_panel input.text_area:hover{
    border:solid 1px #FF5A00;
}
#top_panel input.text_area:focus{
    /*border:solid 1px #FF5A00;*/
    background: #323232;
    color:white;
}

#top_panel input.bt_valid{
    background: url(../img/icone_loupe.png) no-repeat center,
                url(../img/motif_fond_bouton_orange.png) repeat-x center,
                url(../img/motif_header_panel_left.png) repeat-x top;
}

#top_panel input.bt_valid:active{
   
    box-shadow: 0px 0px 3px black inset,0px 0px 7px black inset;
    
}



a{
    text-decoration:none;
    color:#b2b2b2;
    
}

a:hover{
    
    color:#fe7b00;
    
}

.error,.ok{
    
    display:inline-block;
    
    padding:2px;
    padding-left:5px;
    padding-right: 5px;
     
    color:white;
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x center;
    min-height:14px;
    
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    
    border: solid 1px orange;
    
    margin:1px;
    
}

.ok{
   background: url(../img/motif_fond_bouton_bleu.png) repeat-x center;
   background-color:#00B1C2;
   border: solid 1px blue;
   
   /*padding:5px;*/
   
   -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
}

.bt{
    display:inline-block;
    
    padding-left:19px;
    padding-right: 0px;
      
    background-position: 0px;
    min-height:14px;
    
    margin:1px;
    
    cursor: pointer;
    /*min-width:18px;*/
    
}

.bt.icone{
    
    padding:0px;
    
    height:16px;
    width:18px;
    
}

#left_panel span.bt{
    min-width:110px;
}

.bt.background{
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background-color: white;
    
    border: solid 1px white;
    
    color:black;
    /*color:black;*/
    
    /*display:inline-block;*/
    /*max-width:340px;*/
    /*border: solid 1px white;*/
    
}

.commentContent .bt.user{

    box-shadow: 0px 0px 1px black,0px 0px 1px black;
}


.bt.right{
    
   background-position: right;
   padding-right:22px;
   padding-left:7px;
    
}

.bt.lien{ 
    background-image: url(../img/bouton_lien.png);
    background-repeat:no-repeat;
}

.bt.like{
    
    /*font-size: 10px;*/
    
    color:#00EAFF;
   border:solid 1px #2c2c2c;
    
    background-image: url(../img/bouton_like.png);
    background-repeat:no-repeat;
    
    background-color: #2c2c2c;
    /*background-color: #f0f0f0;*/
    
}

.bt.like:hover{
    color:white;
    background-color: #FA512F;
    /*border-color: #96ff26;*/
}

.bt.unlike{ 
    /*font-size: 10px;*/
    
  color:#FF3000;
    border:solid 1px #711000;
    
    background-image: url(../img/bouton_unlike.png);
    background-repeat:no-repeat;
    
    background-color: #2c2c2c;
   
}
.bt.unlike:hover{
    color:white;
    background-color: #FA512F;
}

.bt.user{ 
    background-image: url(../img/bouton_user.png);
    background-repeat:no-repeat;
}

.bt.notifications{ 
    background-image: url(../img/bouton_notifications.png);
    background-repeat:no-repeat;
}

.bt.messages{ 
    background-image: url(../img/bouton_messages.png);
    background-repeat:no-repeat;
}

.bt.ask{ 
    background-image: url(../img/bouton_ajout.png);
    background-repeat:no-repeat;
}

.bt.contacts{ 
    background-image: url(../img/bouton_contacts.png);
    background-repeat:no-repeat;
}

.bt.fichiers{ 
    background-image: url(../img/bouton_fichiers.png);
    background-repeat:no-repeat;
}


.bt.home{ 
    background-image: url(../img/bouton_home.png);
    background-repeat:no-repeat;
}

.bt.mail{ 
    background-image: url(../img/bouton_mail.png);
    background-repeat:no-repeat;
}

.bt.minimize{ 
    background-image: url(../img/bouton_minimize.png);
    background-repeat:no-repeat;
}
#maximize{ 
    display:none;
}

.bt.close{ 
    background-image: url(../img/bouton_close.png);
    background-repeat:no-repeat;
}

span.button{
    display:inline-block;
    padding:2px;
    padding-left:10px;
    padding-right:10px;
    
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    
    border:solid 2px;
    background-color: white;
    color:black;
    
}

.button.bt_valid{
    cursor: pointer;
    background:url(../img/motif_header_panel_left.png) repeat-x top;
    min-width:50px;
    
    /*color:#008591;*/
    
}



/*.button.bt_valid.yes#valid_post{
  position : absolute;
  right:215px;
  bottom:50px;
  opacity:0;
  visibility:hidden;
  
    
}*/
.button.bt_valid.yes:hover{
    background: url(../img/motif_fond_bouton_bleu.png) repeat-x center;
}

/*.button.bt_valid.no#cancel_post{
  position : absolute;
  right:145px;
  bottom:50px;
  opacity:0;
  visibility:hidden;
}*/
.button.bt_valid.no:hover{
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x center;
}

/*.button.bt_valid.other#empty_post{
  position : absolute;
  right:90px;
  bottom:50px;
  opacity:0;
  visibility:hidden;
}*/
.button.bt_valid.other:hover{
    background: url(../img/motif_fond_bouton_orange.png) repeat-x center;
}


#post_buttons{
  position : absolute;
  right:90px;
  bottom:50px;
  opacity:0;
  visibility:hidden;
}


/*
.button.bt_valid.yes{
  position : relative;
  right:160px;
  bottom:50px;
  opacity:0;
  visibility:hidden;
  
    
}

.button.bt_valid.no:hover{
    background: url(../img/motif_fond_bouton_rouge.png) repeat-x center;
}

.button.bt_valid.no{
  position : relative;
  left:200px;
  bottom:50px;
  opacity:0;
  visibility:hidden;
    
}*/